<template>
	<view>
		<view class="page-head">
			<view>
				<u-tabs :list="list" :is-scroll="false" :current="current" @change="val=>{current = val}"></u-tabs>
			</view>
		</view>
		<view class="scroll-box">
			<cusdetails :form='result' v-if="current === 0"/>
			<feedback :form='result' v-if="current === 1"/>
			<view style="width: 100%;padding: 0 32upx 0 32upx;background-color: #fff;" v-if="Remark">
				<formItem 
				:label="orderStatus === '5'? '审核意见' : '反馈结果'" 
				v-model="dlrReviewRemark" 
				:placeholder="orderStatus === '5'? '请输入审核意见' : '请输入反馈结果'" 
				titleType="dotted-title"></formItem>
			</view>			
			<view class="btn-box" v-if="btnshow">
				<view :style="btnWidth" v-for="(item,index) in btnList" :key="index">
					<u-button :plain="item.plain === undefined ? false : item.plain" :type="item.type" @click="send(item)">{{item.name}}</u-button>
				</view>
			</view>
		</view>		
	</view>
</template>

<script>
	import cusdetails from './components/cusdetails.vue';
	import feedback from './components/feedback.vue';
	import formItem from '@/components/lt-formItem/index.vue'
	import { findClientReviewDetail, toAcceptThe, toApplyForReview, Addfeedback ,toApplyForTheSettlement,rejectedOrder} from '@/api/clientreview.js'
	export default {
		components:{
			cusdetails,
			feedback,
			formItem
		},	
		async onLoad(option){
			console.log(option)
			this.orderId = option.orderId
			let params = {
				orderId :option.orderId
				// orderId :'57c70426-01a7-11ec-983c-005056852a1a'
			}
			let res = await findClientReviewDetail(params)
			this.result = res.rows
			this.statusCode = res.rows.statusCode
			this.orderStatus = res.rows.orderStatus
			this.orderType = res.rows.orderType
			this.$forceUpdate()
			console.log('returnList',this.result)
		},
		computed:{
			btnshow(){
				if(this.statusCode == '2' && this.current === 1 ){
					return false
				} else {
					return true 
				}
			},
			btnWidth(){
				if(this.btnList === undefined )return 
				// 动态计算button宽度
				return `width:${((1/this.btnList.length - 0.05) * 100).toFixed(0)}%;`
			},
			Remark(){
				if(this.orderType !== '4' && this.orderStatus === '5') return false 
				if(this.orderStatus === '3' ||this.orderStatus === '4' || this.orderStatus === '5') {
					return true 
				}  else {
					return false 
				}
			},
			btnList(){
				switch(this.orderStatus){
					case '2': 
					case '6':
						return [
							{
								name:'受理',
								plain:true,
								funName:'toAcceptThe'
							}
						]
						break;
					case '3':
						return [
							{
								name:'反馈',
								plain:true,
								funName:'Addfeedback'
							}
						]
						return 
						break;
					case '4':
						return [
							{
								name:'反馈',
								plain:true,
								funName:'Addfeedback'
							},{
								name:'申请结案',
								plain:true,
								type:'primary',
								funName:'toApplyForReview'
							}
						]
						break;
					case '5':
					if(this.orderType === '4'){
						return [
							{
								name:'驳回',
								plain:true,
								funName:'rejectedOrder'
							},{
								name:'通过',
								plain:true,
								type:'primary',
								funName:'toApplyForTheSettlement'
							}
						]
					} 
						
						break;
				}
			},
		},
		data(){
			return {
				orderId:null,
				statusCode:null,
				orderStatus:null,
				current:0,
				list:[{
					name: '客户信息'
				},{
					name: '反馈信息'
				}],
				result:{},
				btnType:'2',
				dlrReviewRemark:''
			}
		},
		methods:{
			async send(val){
				const that = this 
				let res = null
				let params = {}
				switch(val.funName){
					case 'toAcceptThe':
						params = {
							orderCode: that.result.orderCode
						}
						res = await toAcceptThe(params)
						break;
					case 'Addfeedback':
						if(!this.dlrReviewRemark){
							uni.showToast({
								title:'请输入反馈详情!',
								icon:'none',
								duration:3000
							})
							return 
						}
						params = {
							orderCode:that.result.orderCode,
							dlrReviewRemark:that.dlrReviewRemark
						}
						res = await Addfeedback(params)
						this.dlrReviewRemark = null
						break;
					case 'toApplyForReview':						
						params = {
							orderCode: that.result.orderCode
						}
						res = await toApplyForReview(params)
						break;
					case 'toApplyForTheSettlement':
						if(!that.dlrReviewRemark){
							uni.showToast({
								title:'请输入审核意见',
								icon:'none',
								duration:2000
							})
							break;
						}
						params = {
							checkRemark:that.dlrReviewRemark,
							orderCode: that.result.orderCode
						}
						res = await toApplyForTheSettlement(params)
						break;
					case 'rejectedOrder':
						if(!that.dlrReviewRemark){
							uni.showToast({
								title:'请输入审核意见',
								icon:'none',
								duration:2000
							})
							break;
						}
						params = {
							checkRemark:that.dlrReviewRemark,
							orderCode: that.result.orderCode						
						}
						res = await rejectedOrder(params)
						break;
				}
				if(res.result === '1'){
					uni.showToast({
						title:res.msg,
						icon:'success',
						duration:3000
					})					
				} else {
					uni.showToast({
						title:res.msg,
						icon:'error',
						duration:3000
					})	
				}
				uni.navigateBack()
				// let reloadParams = {
				// 	orderId :this.orderId
				// }
				// // let reloadRes = await findClientReviewDetail(reloadParams)
				// if(reloadRes.result === '1'){
				// 	uni.showToast({
				// 		title:'更新完成!',
				// 		icon:'success',
				// 		duration:2000
				// 	})					
					// this.result = reloadRes.rows
					// this.orderStatus = reloadRes.rows.orderStatus
					// this.$forceUpdate()
				// } else{
				// 	uni.showToast({
				// 		title:'数据更新失败!',
				// 		icon:'success',
				// 		duration:2000
				// 	})
				// 	uni.navigateBack()		
				// }
						
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page-head{
		width: 100%;
		height: 6vh;
	}
	.scroll-box{
		width: 100%;
		height: 92vh;
		overflow: hidden;
		overflow-y: scroll;
		.btn-box{
			width: 100%;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			margin-bottom: 60upx;
			margin-top:30upx;		
			padding: 0 32upx 0 32upx;
		}
	}	
</style>
